<template>
	<scroll-view scroll-y="true">
		<view class="pageAll">
			<view class="pageTop">
				<swiper class="pageSwiper" indicator-dots="true" indicator-color="#696868" indicator-active-color="#FFF" autoplay="true">
					<swiper-item class="swiperItem" v-for="(item, index) in imgList" :key="index">
						<view class="swiperImg" :style="'background-image:url('+item.banner_img+')'" :alt="item.title" @click="toFileDetails(item.type === 'notice'?1:2, item.title, item.message_id)"></view>
					</swiper-item>
				</swiper>
			</view>
			<view class="pageBottom">
				<view class="bottomContent">
					<view class="bottomTitle" hover-class="routerActive" @click="toFileList(1)">
						<text>
							红标公告
						</text>
					</view>
					<view class="bottomInfo">
						<view v-for="(item, index) in announcementList" :key="index" class="pageFileView" @click="toFileDetails(1, item.title, item.id)">
							<fileView :imgType="'img'" :fileName="item.title" :fileDate="formatTime(item.create_time, 'Y-M-D')" :fileAuthor="item.username"
							 :imgSrc="item.cover" />
						</view>
					</view>
				</view>
				<view class="bottomContent">
					<view class="bottomTitle" hover-class="routerActive" @click="toFileList(2)">
						<text>
							红标活动
						</text>
					</view>
					<view class="bottomInfo">
						<view v-for="(item, index) in activeList" :key="index" class="pageFileView" @click="toFileDetails(2, item.name, item.id)">
							<fileView :imgType="'img'" :fileName="item.title" :fileDate="formatTime(item.create_time, 'Y-M-D')" :fileAuthor="item.username"
							 :imgSrc="item.cover" />
						</view>
					</view>
				</view>
			</view>
			<modal :title="modalTitle" @hiddenModal="hiddenModal" :modelVisible="modelVisible" />
		</view>
	</scroll-view>
</template>

<script>
	import modal from '../../../components/indexCom/modal.vue'
	import fileView from '../../../components/commonCom/fileView.vue'
	import {
		formatTime
	} from '@/utils/tools.js'
	let inter = null
	export default {
		data() {
			return {
				imgList: [], // 轮播图
				announcementList: [], // 公告列表
				activeList: [] // 活动列表
			}
		},
		computed: {
			modelVisible() {
				return this.$store.getters.getIndexModal.isShow
			},
			modalTitle() { // 弹窗信息
				return this.$store.getters.getIndexModal.content
			}
		},
		methods: {
			formatTime, // 时将戳转换 ， 格式 YDM hms
			// 跳转至文件或公告列表 type=1 为文件，2为活动
			toFileList(value) {
				uni.navigateTo({
					url: '../fileList/fileList?type=' + value
				});
			},
			// 跳转至文件或公告详情type=1 为文件，2为公告 title为顶部导航栏标题
			toFileDetails(type, title, id) {
				uni.navigateTo({
					url: '../fileDetails/fileDetails?type=' + type + '&title=' + title + '&id=' + id
				});
			},
			// 
			hiddenModal() {
				this.$store.commit('setIndexModal', {
					if_show: 1
				}) // 修改vuex隐藏首页提示框
				uni.showTabBar({})
			},
			setInter() {
				clearInterval(inter)
				inter = setInterval(() => {
					this.getTabtar()
				}, 15000)
			},
			getTabtar() {
				this.$api.selectBottomRemind({
						isNoNeedLoading: true
					})
					.then(res => {
						if (res.status) {
							if (res.data.index) {
								uni.showTabBarRedDot({
									index: 0,
								})
							} else {
								uni.hideTabBarRedDot({
									index: 0,
								})
							}
							if (res.data.submission) {
								uni.showTabBarRedDot({
									index: 1,
								})
							} else {
								uni.hideTabBarRedDot({
									index: 1,
								})
							}
							if (res.data.order) {
								uni.showTabBarRedDot({
									index: 2,
								})
							} else {
								uni.hideTabBarRedDot({
									index: 2,
								})
							}
						} else {}
					})

				this.$api.getUserNewsCount({
						isNoNeedLoading: true
					})
					.then(res => {
						if (res.status) {
							// 设置TabBarBadge
							uni.setTabBarBadge({
								index: 3,
								text: res.count + ''
							})
							this.$store.commit('setMessTip', res.count)
						} else {
							uni.removeTabBarBadge({
								index: 3
							})
							this.$store.commit('setMessTip', null)
						}
					})
			},
			getReady() {
				// 获取轮播图
				this.$api.selectBanner({})
					.then(res => {
						if (res.status) {
							this.imgList = res.data
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 1500,
							})
						}
					})
				// 获取活动列表
				this.$api.selectIndexActivity({
						sum: 3
					})
					.then(res => {
						if (res.status) {
							this.activeList = res.data
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 1500,
							})
						}
					})
				// 获取首页公告列表
				this.$api.selectIndexNotice({
						sum: 3, // 返回的数据条数
					})
					.then(res => {
						if (res.status) {
							this.announcementList = res.data
						} else {}
					})
			}
		},
		components: {
			fileView,
			modal,
		},
		mounted() {
			// uni.hideTabBar()
		},
		onLoad() {
			
			// if(uni.getStorageSync('nstorage_state') && uni.getStorageSync('nstorage_state')=='2'){
				
			// }else{
			// 	this.$api.selectPopUp({})
			// 		.then(res => {
			// 			if (res.status) {
			// 				this.$store.commit('setIndexModal', res.data)
			// 				if (this.modelVisible) {
			// 					uni.hideTabBar({})
			// 				}
			// 			} else {
			// 				uni.showToast({
			// 					title: res.msg,
			// 					icon: 'none',
			// 					duration: 1500,
			// 				})
			// 			}
			// 		})
			// 	uni.hideLoading()
			// 	this.getReady()
			// 	this.getTabtar()
			// 	this.setInter()
			// }
			
			
			
		},
		onShow() {
			this.$api.selectPopUp({})
				.then(res => {
					if (res.status) {
						this.$store.commit('setIndexModal', res.data)
						if (this.modelVisible) {
							uni.hideTabBar({})
						}
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 1500,
						})
					}
				})
			uni.hideLoading()
			this.getTabtar()
			this.setInter()	
			this.getReady()
			uni.setNavigationBarTitle({
				title: '红标首页'
			});
			// if( !uni.getStorageSync('nstorage_state')){
				
			// 	uni.reLaunch({
			// 		url: '/pages/indexPage/login/login'
			// 	})
			// }else{
			// 	uni.reLaunch({
			// 		url: '/pages/index/index/index.vue'
			// 	})
			// }
		},
		
		onUnload() {
			clearInterval(inter)
		},
		onShareAppMessage: (options) => {
			// 设置菜单中的转发按钮触发转发事件时的转发内容
			var shareObj = {
				title: "红标HONBIAO", // 默认是小程序的名称(可以写slogan等)
				path: '/pages/indexPage/authorization/authorization', // 默认是当前页面，必须是以‘/’开头的完整路径
				imageUrl: '/static/index/labelRouge.png', //自定义图片路径，可以是本地文件路径、代码包文件路径或者网络图片路径，支持PNG及JPG，不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
				success: (res) => {
					// 转发成功之后的回调
					if (res.errMsg == 'shareAppMessage:ok') {}
				},
				fail: () => {
					// 转发失败之后的回调
					if (res.errMsg == 'shareAppMessage:fail cancel') {
						// 用户取消转发
					} else if (res.errMsg == 'shareAppMessage:fail') {
						// 转发失败，其中 detail message 为详细失败信息
					}
				}
			};
			return shareObj
		},

	}
</script>

<style scoped>
	.pageAll {
		box-sizing: border-box;
		background-color: #fdf5f3;
		width: 100%;
		max-height: 100%;
		padding: 0 17upx;
		display: inline-block;
	}

	.pageTop {
		margin-top: 17upx;
	}

	.pageSwiper {
		width: 100%;
		height: 630.66upx;
		border-radius: 18upx;
		box-shadow: 0 0 20upx 8upx rgba(182, 42, 42, 0.2);
	}

	.swiperItem {
		border-radius: 18upx;
		width: 100%;
		height: 100%;
	}

	.swiperImg {
		border-radius: 18upx;
		width: 100%;
		height: 100%;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}

	.pageBottom {
		margin-top: 35upx;
		height: 570.66upx;
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-between;
		margin-bottom: 17upx;
	}

	.bottomContent {
		background-color: #FFF;
		border-radius: 30upx;
		box-shadow: 0 0 20upx 8upx rgba(182, 42, 42, 0.1);
		width: 350upx;
		padding: 17upx;
		box-sizing: border-box;
	}

	.bottomTitle {
		color: #e43131;
		font-size: 36upx;
		font-weight: 600;
	}

	.bottomInfo {
		margin-top: 55upx;
		display: inline-block;
		width: 100%;
	}

	.pageFileView {
		height: 110upx;
		margin-bottom: 34upx;
		width: 100%;
		display: inline-block;
	}

	.routerActive {
		color: #f3d6d4 !important;
	}
</style>
